/*
 * @Descripttion : 消息提示
 * @Author       : QianFox Team
 * @Date         : 2022-03-10 16:02:48
 * @LastEditors  : Please set LastEditors
 * @LastEditTime : 2023-02-28 16:43:46
 */

import { _zIndex } from './common/variables';
import { _typeOf } from './common/utils';

/**
 * @description: message 构造函数
 * @param {*} text             显示内容
 * @param {*} type             类型：1、warning， 2、danger， 3、success， 4、info， 5、primary
 * @param {*} duration         持续时间(毫秒)，如为 0，则不会自动关闭
 * @param {*} showClose        是否显示关闭
 * @return {*}
 * @Date: 2022-03-10 17:07:45
 */
function Message({ text, type, duration, showClose }) {
    this.MESSAGE = '.foxui-message';
    this.BODY_MESSAGE = 'body > .foxui-message';
    this.LAST_MESSAGE = 'body > .foxui-message:last';
    this.CLOSE_HANDLE = '.foxui-message-close__button';

    this.HEIGHT = 50;
    this.MARGIN = 20;
    this.TYPELIST = ['primary', 'warning', 'danger', 'success', 'info'];

    this.text = text || '';
    this.type = this.TYPELIST.indexOf(type) !== -1 ? type : 'info';
    this.duration = !isNaN(Number(duration)) ? duration : 3000;
    this.showClose = showClose || false;
}

/**
 * @description: 添加消息提示
 * @param {*}
 * @return {*}
 * @Date: 2022-03-10 17:08:01
 */
Message.prototype._add = function () {
    let that = this;
    let len = $(this.MESSAGE).length,
        top = len * (this.HEIGHT + this.MARGIN) + this.MARGIN;

    // 添加 message
    $('body').append(this._messageHtml(top));
    let $lastMessage = $(this.LAST_MESSAGE);
    $lastMessage.slideDown('fast').fadeIn('fast');

    // 自动关闭
    if (that.duration !== 0) {
        setTimeout(() => {
            that._close($lastMessage);
        }, that.duration);
    }

    // 绑定点击关闭
    this._bindClose($lastMessage);
};

/**
 * @description: 消息提示 html
 * @param {*} top
 * @return {*}
 * @Date: 2022-03-10 17:08:19
 */
Message.prototype._messageHtml = function (top) {
    return [
        `<div class="foxui-message foxui-message-${this.type}" style="display:none; z-index:${_zIndex()}; top:${top}px">`,
        `<span class="foxui-message-content">${this.text}</span>`,
        `${this.showClose ? '<i class="foxui-icon-guanbi-o foxui-message-close__button"></i>' : ''}`,
        '</div>',
    ].join('');
};

/**
 * @description: 绑定关闭
 * @param {*} message
 * @return {*}
 * @Date: 2022-03-11 13:02:16
 */
Message.prototype._bindClose = function ($message) {
    let that = this;
    $message.find(this.CLOSE_HANDLE).on('click', function () {
        that._close($message);
    });
};

/**
 * @description: 关闭
 * @param {*} message
 * @return {*}
 * @Date: 2022-03-11 13:02:28
 */
Message.prototype._close = function ($message) {
    let that = this;
    $message.slideUp('fast').fadeOut('fast', function () {
        $(this).remove();
        $(that.MESSAGE).each(function () {
            const index = $(that.BODY_MESSAGE).index(this);
            $(this).css('top', index * (that.HEIGHT + that.MARGIN) + that.MARGIN);
        });
    });
};

/**
 * @description: 实例化消息提示函数
 * @param {*} data
 * @return {*}
 * @Date: 2022-03-10 17:08:32
 */
function message(data) {
    let params = {};

    if (_typeOf(data) === 'object') {
        data && (params = data);
    } else {
        throw new Error(`message 方法传入参数必须是一个对象！`);
    }

    // 实例化加载层
    let message = new Message(params);
    // 添加加载层
    message._add();
}

export { message };
